
<!DOCTYPE HTML><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0 minimal-ui"/>
<meta name="apple-mobile-web-app-capable" content="yes"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black">

<link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/splash/splash-icon.png">
<link rel="apple-touch-icon-precomposed" sizes="180x180" href="images/splash/splash-icon-big.png">
<link rel="apple-touch-startup-image" href="images/splash/splash-screen.png" 	media="screen and (max-device-width: 320px)" />  
<link rel="apple-touch-startup-image" href="images/splash/splash-screen@2x.png" media="(max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)" /> 
<link rel="apple-touch-startup-image" href="images/splash/splash-screen-six.png" media="(device-width: 375px)">
<link rel="apple-touch-startup-image" href="images/splash/splash-screen-six-plus.png" media="(device-width: 414px)">
<link rel="apple-touch-startup-image" sizes="640x1096" href="images/splash/splash-screen@3x.png" />
<link rel="apple-touch-startup-image" sizes="1024x748" href="images/splash/splash-screen-ipad-landscape" media="screen and (min-device-width : 481px) and (max-device-width : 1024px) and (orientation : landscape)" />
<link rel="apple-touch-startup-image" sizes="768x1004" href="images/splash/splash-screen-ipad-portrait.png" media="screen and (min-device-width : 481px) and (max-device-width : 1024px) and (orientation : portrait)" />
<link rel="apple-touch-startup-image" sizes="1536x2008" href="images/splash/splash-screen-ipad-portrait-retina.png"   media="(device-width: 768px)	and (orientation: portrait)	and (-webkit-device-pixel-ratio: 2)"/>
<link rel="apple-touch-startup-image" sizes="1496x2048" href="images/splash/splash-screen-ipad-landscape-retina.png"   media="(device-width: 768px)	and (orientation: landscape)	and (-webkit-device-pixel-ratio: 2)"/>

<title>Epsilon Mobile Framework - Version 2.0</title>

<link href="styles/style.css"     		 rel="stylesheet" type="text/css">
<link href="styles/framework.css" 		 rel="stylesheet" type="text/css">
<link href="styles/owl.theme.css" 		 rel="stylesheet" type="text/css">
<link href="styles/swipebox.css"		 rel="stylesheet" type="text/css">
<link href="styles/font-awesome.css"	 rel="stylesheet" type="text/css">
<link href="styles/animate.css"			 rel="stylesheet" type="text/css">

<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/jqueryui.js"></script>
<script type="text/javascript" src="scripts/framework.plugins.js"></script>
<script type="text/javascript" src="scripts/custom.js"></script>

</head>
<body> 

<div id="preloader">
	<div id="status">
    	<p class="center-text">
			Loading the content...
            <em>Loading depends on your connection speed!</em>
        </p>
    </div>
</div>
    
       
<div class="all-elements">
    <div class="snap-drawers">
        <!-- Left Sidebar -->
        <div class="snap-drawer snap-drawer-left">
            <a href="index.html"><i class="fa fa-home"></i>Home</a>
            <a href="page-features.html" class="selected-item"><i class="fa fa-cog"></i>Features</a>
            <a href="page-media.html"><i class="fa fa-picture-o"></i>Media</a>
            <a href="page-blog.html"><i class="fa fa-pencil"></i>Blog</a>
            <a href="contact.html"><i class="fa fa-envelope-o"></i>Contact</a>
            <a href="#"><i class="fa fa-facebook"></i>Like Us</a>
            <a href="#"><i class="fa fa-twitter"></i>Follow Us</a>
            <a href="#"><i class="fa fa-google-plus"></i>Follow us</a>
            <a href="#" class="show-share-bottom"><i class="fa fa-retweet"></i>Share</a>
            <a href="#" class="sidebar-close"><i class="fa fa-times"></i>Close</a>
        </div>
    </div>
    
    <div class="header">
        <a href="#" class="main-logo"></a>
        <a href="#" class="open-menu"><i class="fa fa-navicon"></i></a>
        <a href="#" class="open-call"><i class="fa fa-phone"></i></a>
        <a href="#" class="open-mail"><i class="fa fa-envelope-o"></i></a>
    </div> 
    
    <a href="#" class="footer-ball"><i class="fa fa-navicon"></i></a>
    
    <!-- Page Content-->
    <div id="content" class="snap-content">        
        <div class="header-clear"></div>
        <div class="content">
 
            <div class="one-half-responsive">
                <h3>Calendar Design</h3>
                <p>
                    A calendar template, you can use to show schedules, events and whatever else you want! 
                    This is a calendar template. You can create months by simply adding days, years and more.
                </p>
                <div class="decoration"></div>
                <h3 class="right-text half-bottom">January, 2025</h3>
                <div class="calendar-titles">
                    <a class="light-titles" href="#">S</a>
                    <a href="#">M</a>
                    <a href="#">T</a>
                    <a href="#">W</a>
                    <a href="#">T</a>
                    <a href="#">F</a>
                    <a class="light-titles" href="#">S</a>
                </div>
                <div class="decoration half-bottom"></div>
                <div class="calendar-days">
                    <!-- &nbsp adds a space for the single numbers, this way they can be centered in boxes -->
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>&nbsp1</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>&nbsp2</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>&nbsp3</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>&nbsp4</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>&nbsp5</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>&nbsp6</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>&nbsp7</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>&nbsp8</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>&nbsp9</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>10</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>11</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>12</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>13</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>14</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>15</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>16</a>
                    <a class="taken-day" href="#"><i class="fa fa-circle"></i>17</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>18</a>
                    <a class="close-day" href="#"><i class="fa fa-circle"></i>19</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>20</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>21</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>22</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>23</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>24</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>25</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>26</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>27</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>28</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>29</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>30</a>
                    <a class="clear-day" href="#"><i class="fa fa-circle"></i>31</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>&nbsp1</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>&nbsp2</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>&nbsp3</a>
                    <a class="light-day" href="#"><i class="fa fa-circle"></i>&nbsp4</a>
                </div>
            </div>
            <div class="one-half-responsive last-column">      
                <div class="calendar-hours">
                    <a href="#" class="calendar-hour calendar-hour-taken">
                        <strong class="cal-from">0:00 AM</strong>
                        <strong class="cal-to">  9:00 AM</strong>
                        <h4>Closing Hours</h4>
                        <em><i class="fa fa-map-marker"></i>Melbourne Victoria</em>
                    </a>                   
                    <a href="#"  class="calendar-hour calendar-hour-clear">
                        <strong class="cal-time">10:00 AM</strong>
                        <h4> </h4>
                        <em> </em>
                    </a>                                 
                    <a href="#"  class="calendar-hour calendar-hour-taken">
                        <strong class="cal-time">11:00 PM</strong>
                        <h4>Lunch</h4>
                        <em><i class="fa fa-cutlery"></i>Restaurant, Miami Beach</em>
                    </a>                   
                    <a href="#"  class="calendar-hour calendar-hour-taken">
                        <strong class="cal-from">12:00 PM</strong>
                        <strong class="cal-to">09:00 PM</strong>
                        <h4>Work</h4>
                        <em><i class="fa fa-suitcase"></i>Working Headquarters</em>
                    </a>  
                    <a href="#"  class="calendar-hour calendar-hour-clear">
                        <strong class="cal-time">10:00 AM</strong>
                        <h4> </h4>
                        <em> </em>
                    </a>                     
                    <a href="#"  class="calendar-hour calendar-hour-clear">
                        <strong class="cal-time">11:00 AM</strong>
                        <h4> </h4>
                        <em> </em>
                    </a>                 
                    <a href="#" class="calendar-hour calendar-hour-taken">
                        <strong class="cal-time">12:00 PM</strong>
                        <h4>John's Birthday!</h4>
                        <em><i class="fa fa-birthday-cake"></i> Wish him a happy birthday!</em>
                    </a> 
                </div>
            </div>
            <div class="decoration"></div>      
            
        </div>
        <!-- Page Footer-->
        <div class="footer">
            <p class="center-text">Copyright 2015. All rights reserved.</p>
            <div class="footer-socials half-bottom">
                <a href="#" class="footer-facebook"><i class="fa fa-facebook"></i></a>
                <a href="#" class="footer-twitter"><i class="fa fa-twitter"></i></a>
                <a href="#" class="footer-transparent"></a>
                <a href="#" class="footer-share show-share-bottom"><i class="fa fa-share-alt"></i></a>
                <a href="#" class="footer-up"><i class="fa fa-angle-up"></i></a>
            </div>
        </div>    
        
    </div>
    
    <div class="share-bottom">
        <h3>Share Page</h3>
        <div class="share-socials-bottom">
            <a href="">
                <i class="fa fa-facebook facebook-color"></i>
                Facebook
            </a>
            <a href="">
                <i class="fa fa-twitter twitter-color"></i>
                Twitter
            </a>
            <a href="">
                <i class="fa fa-google-plus google-color"></i>
                Google
            </a>

            <a href="">
                <i class="fa fa-pinterest-p pinterest-color"></i>
                Pinterest
            </a>
            <a href="sms:">
                <i class="fa fa-comment-o sms-color"></i>
                Text
            </a>
            <a href="">
                <i class="fa fa-envelope-o mail-color"></i>
                Email
            </a>
        </div>
        <a href="#" class="close-share-bottom">Close</a>
    </div>
    
</div>

</body>

